<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh">

<head>
    <title>欢迎云游旅行</title>
    <%@include file="common/common.jsp"%>
</head>

<body>
<%@include file="common/navBarTop.jsp"%>
<div class="container-fluid">
    <div id="root">
        <div id="carousel" class="carousel slide" data-ride="carousel">
            <!-- Wrapper for slides -->
            <div class="carousel-inner" role="listbox">
                <div class="item " :class="{'active':index===0}" v-for="(item,index) in datas.slidePath">
                    <img :src="'<%=path%>/'+item.pic_path" style="width:100%;max-height: 350px;" alt="...">
                    <div class="carousel-caption">
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-8 col-md-offset-2">
                <div class="tab_nav">
                    <div class="row">
                        <div class="col-md-4">
                            <div class="panel panel-default">
                                <div class="panel-heading text-center">景点</div>
                                <div class="panel-body">
                                    <form action="<%=path%>/scenic_spot/list" method="post">
                                        <div class="form-group text-center" style="margin-bottom:0;">
                                            <label for="scenicTitle">名称关键字：</label>
                                            <input type="text" class="form-control  input-s"
                                                   placeholder="石林" id="scenicTitle" name="scenicTitle" v-model="scenicTitle">
                                        </div>
                                        <div class="form-group text-center" style="margin-bottom:0;">
                                            <label for="scenicStar">星级：</label>
                                            <select class="form-control input-s" id="scenicStar" name="scenicStar" v-model="scenicStar">
                                                <option value="0">请选择</option>
                                                <option value="A">A</option>
                                                <option value="AA">AA</option>
                                                <option value="AAA">AAA</option>
                                                <option value="AAAA">AAAA</option>
                                                <option value="AAAAA">AAAAA</option>
                                            </select>
                                        </div>
                                        <div class="text-center">
                                            <button type="submit" class="btn btn-success"  target="_blank">查询</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="panel panel-default">
                                <div class="panel-heading text-center">酒店</div>
                                <div class="panel-body">
                                    <form action="<%=path%>/hotel/list" method="post">
                                        <div class="form-group text-center" style="margin-bottom:0;">
                                            <label for="hotelTitle">酒店名称：</label>
                                            <input type="text" class="form-control input-s" name="hotelTitle" id="hotelTitle" v-model="hotelTitle">
                                        </div>

                                        <div class="form-group text-center " style="margin-bottom:0;">
                                            <label for="hotelAddress">酒店地址：</label>
                                            <input type="text" class="form-control input-s" name="hotelAddress" id="hotelAddress" v-model="hotelAddress">
                                        </div>
                                        <div class="text-center">
                                            <button type="submit" class="btn btn-success">查询</button>
                                        </div>


                                    </form>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="panel panel-default">
                                <div class="panel-heading text-center">票务</div>
                                <div class="panel-body">
                                    <form action="<%=path%>/ticket/list" method="post">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <div class="form-group" style="margin-bottom:0;">
                                                    <label for="ticketStartStation">出发地：</label>
                                                    <input type="text" class="form-control" name="ticketStartStation" id="ticketStartStation" v-model="ticketStartStation" placeholder="昆明">
                                                </div>
                                                <div class="form-group" style="margin-bottom:0;">
                                                    <label for="ticketLastStation">目的地</label>
                                                    <input type="text" class="form-control" name="ticketLastStation" id="ticketLastStation" v-model="ticketLastStation"
                                                           placeholder="石林">
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group" style="margin-bottom:0;">
                                                    <label for="ticketStartDate">出发日期：</label>
                                                    <input type="text" id="ticketStartDate" v-model="ticketStartDate" name="ticketStartDate"
                                                           class="form-control input-s" onclick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'%y-%M-{%d}'})" readonly />
                                                </div>
                                            </div>
                                        </div>
                                        <div class="text-center">
                                            <button type="submit" class="btn btn-success">查询</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>

                <div class="panel panel-info panel_h">
                    <div class="panel-heading">
                        <h3 class="panel-title">景点推荐</h3>
                    </div>
                    <div class="panel-body" >
                        <div class="row">
                            <div class="col-md-9">
                                <div class="row">
                                    <div class="col-md-3" v-for="(scenic , index) in datas.scenicInfo">
                                        <a :href='"<%=path%>/pages/scenic_spot/detail.jsp?id="+scenic.id' target="_blank" class="thumbnail">
                                            <img :src="'<%=path%>/'+scenic.cover_pic" style="max-width: 150px;max-height: 150px;" alt="...">
                                            <div class="caption text-center">
                                                {{scenic.main_title}}
                                            </div>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <img src="<%=path%>/assets/img/right.png"
                                     style="max-width: 100%;max-height: 100%;padding-top: 15px;padding-right: 10px" alt="...">
                            </div>
                        </div>
                    </div>
                </div>

                <div class="panel panel-danger">
                    <div class="panel-heading">
                        <h3 class="panel-title">酒店推荐</h3>
                    </div>
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-md-3">
                                <div class="list-group" style="padding-top: 15px;padding-left: 15px">
                                    <a class="list-group-item" target="_blank"
                                            :href='"<%=path%>/pages/hotel/detail.jsp?id="+hotel.id'  v-for="(hotel , index) in datas.hotelInfo">
                                                {{hotel.descr}}
                                    </a>
                                </div>
                            </div>
                            <div class="col-md-9">
                                <div class="row">
                                    <div class="col-md-3" v-for="(hotel , index) in datas.hotelInfo">
                                        <a :href='"<%=path%>/pages/hotel/detail.jsp?id="+hotel.id' target="_blank" class="thumbnail">
                                            <img :src="'<%=path%>/'+hotel.cover_pic" style="max-width: 150px;max-height: 150px;" alt="...">
                                            <div class="caption text-center">
                                                {{hotel.main_title}}
                                            </div>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <%@include file="common/userLoginModal.jsp"%>
</div>
<%@include file="common/navBarBottom.jsp"%>
<script type="text/javascript">
    var app=new Vue({
        el: '#root',
        data() {
            return {
                datas: {
                    hotelInfo:[],
                    scenicInfo:[],
                    slidePath:[]
                },
                scenicTitle:"",
                scenicStar:"",
                hotelTitle:"",
                hotelAddress:"",
                ticketStartStation:"",
                ticketLastStation:"",
                ticketStartDate:"",

            }
        },
        methods:{
            async getData() {
                const { data: res }=  await axios.get(CONTEXT_PATH+'/index/load/');
                if(res.code===200){
                    console.log(res);
                    this.datas = res.data;
                }else {
                    swal("提示！","发生错误","error")
                }
            },
            async btnScenic() {//查询景区
                var param={
                    "title":this.scenicTitle,
                    "stat":this.scenicStar
                };
                const {data: res} = await axios.get(CONTEXT_PATH + '/scenic_spot/list/',param);
                window.location.href;
                if (res.code !== 200) {
                    swal("提示！", "发生错误", "error")
                }else{

                }
            },
        },
        mounted:function(){
            this.getData();
        }

    });
</script>
</body>

</html>